<view class="modify-page">
    <canvas canvasId="tempCanvas" disableScroll="true" style="width:{{tempCanvasWidth}}px; height:{{tempCanvasHeight}}px; position:absolute;left:-999999px"></canvas>
    <view class="imageView" style="height:{{imgViewHeight}}px" wx:if="{{page==='mainPage'}}">
        <view bindtap="chooseOneImage" class="noImageBox" wx:if="{{imageNotChoosed}}">
            <text>点击选择图片</text>
        </view>
        <view bindtap="saveImgToPhone" class="saveButton" wx:if="{{!imageNotChoosed}}">
            <text class="icon-save"></text>
        </view>
        <image disableScroll="true" src="{{tempImageSrc}}" style="width:{{imgWidth}}px;height:{{imgHeight}}px;top:{{imgTop}}px;left:{{imgLeft}}px"></image>
        <view wx:if="{{imageNotChoosed}}" style="text-align:left;">
            <adComponent  wx:if="{{ad}}" ad="{{ad}}"/>
        </view>
    </view>
    <view class="imageView" style="height:{{imgViewHeight}}px" wx:if="{{page==='cropPage'}}">
        <image bindtouchend="uploadScaleEnd" bindtouchmove="uploadScaleMove" bindtouchstart="uploadScaleStart" disableScroll="true" src="{{tempImageSrc}}" style="width:{{imgWidth}}px;height:{{imgHeight}}px;top:{{imgTop}}px;left:{{imgLeft}}px"></image>
        <view class="cropper-wraper" wx:if="{{isCroper}}">
            <view bindtouchmove="croperMove" bindtouchstart="croperStart" class="corpper-view-box" style="width:{{cutW}}px;height:{{cutH}}px;left:{{cutL}}px;top:{{cutT}}px">
                <view class="cropper-dashed-h"></view>
                <view class="cropper-dashed-v"></view>
                <view class="cropper-line-t" data-drag="top"></view>
                <view class="cropper-line-r" data-drag="right"></view>
                <view class="cropper-line-b" data-drag="bottom"></view>
                <view class="cropper-line-l" data-drag="left"></view>
                <view class="cropper-point point-tr" data-drag="topTight"></view>
                <view catchtouchmove="dragPointMove" catchtouchstart="dragPointStart" class="cropper-point point-rb" data-drag="rightBottom"></view>
                <view class="cropper-point point-bl" data-drag="bottomLeft"></view>
                <view class="cropper-point point-lt" data-drag="leftTop"></view>
            </view>
        </view>
    </view>
    <view class="imageView" style="height:{{imgViewHeight}}px" wx:if="{{page==='textPage'}}">
        <image disableScroll="true" src="{{tempImageSrc}}" style="width:{{imgWidth}}px;height:{{imgHeight}}px;top:{{imgTop}}px;left:{{imgLeft}}px"></image>
        <text bindtap="{{allText.isTextActive?'focusInput':null}}" bindtouchmove="{{allText.isTextActive?'textMove':null}}" bindtouchstart="{{allText.isTextActive?'textMoveStart':null}}" class="active-text" style="left:{{allText.textL}}px;top:{{allText.textT}}px;font-size:{{allText.fontSize}}px;color:{{allText.fontColor}};font-style:{{allText.fontStyle}};font-weight:{{allText.fontWeight}}" wx:if="{{allText.isTextActive}}">{{allText.someText}}</text>
        <input bindinput="inputText" confirmType="done" focus="{{inputFocus}}" style="position:absolute;left:-9999px;"></input>
    </view>
    <view class="imageView" style="height:{{imgViewHeight}}px" wx:if="{{page==='doodlePage'}}">
        <image disableScroll="true" src="{{tempImageSrc}}" style="width:{{imgWidth}}px;height:{{imgHeight}}px;top:{{imgTop}}px;left:{{imgLeft}}px"></image>
        <canvas bindtouchmove="doodleMove" bindtouchstart="doodleStart" canvasId="myCanvas" class="myCanvas" disableScroll="true" style="width:750rpx; height:{{canvasHeight}}px;"></canvas>
    </view>
    <view class="toolbar-bottom" wx:if="{{page==='mainPage'}}">
        <view bindtap="toCropPage">
            <text class="icon-cutter"></text>
            <text class="text">裁剪</text>
        </view>
        <view bindtap="toTextPage">
            <text class="icon-text"></text>
            <text class="text">添加文字</text>
        </view>
        <view bindtap="toDoodlePage">
            <text class="icon-pen"></text>
            <text class="text">涂鸦</text>
        </view>
        <view bindtap="changdePic">
            <text class="icon1"></text>
            <text class="text">更换图片</text>
        </view>
    </view>
    <view class="toolbar-bottom" wx:if="{{page==='cropPage'}}">
        <view bindtap="toMainPage">
            <text class="icon-back"></text>
            <text class="text">主菜单</text>
        </view>
        <view bindtap="openCroper">
            <text class="icon-cutbox"></text>
            <text class="text">裁剪框</text>
        </view>
        <view bindtap="bestShow">
            <text class="icon-bestshow"></text>
            <text class="text">最佳显示</text>
        </view>
    </view>
    <view wx:if="{{page==='doodlePage'}}">
        <view class="toolbar-top toolbar-width" wx:if="{{isChooseWidth}}">
            <view class="slider-box">
                <slider showValue bindchange="widthSliderChange" max="15" min="1" value="5"></slider>
            </view>
        </view>
        <view class="toolbar-top" wx:if="{{isChooseColor}}">
            <view class="color-box">
                <view bindtap="lineColorChange" class="color-point" data-selected="{{item}}" style="background:{{item}}" wx:for="{{allColor}}"></view>
            </view>
        </view>
        <view class="toolbar-bottom">
            <view bindtap="doodleToMainPage">
                <text class="icon-back"></text>
                <text class="text">主菜单</text>
            </view>
            <view bindtap="chooseLineWidth">
                <text class="icon-linewidth"></text>
                <text class="text">宽度</text>
            </view>
            <view bindtap="chooseLineColor">
                <text class="icon-color"></text>
                <text class="text">颜色</text>
            </view>
            <view bindtap="chooseEraser" class="eraser-box" style="background: {{isEraser?'rgba(255,255,255,0.5)':'transparent'}};">
                <text class="icon-eraser"></text>
                <text class="text">橡皮檫</text>
            </view>
            <view bindtap="chooseClear" class="clear-box">
                <text class="icon-clear"></text>
                <text class="text">清除</text>
            </view>
        </view>
    </view>
    <view wx:if="{{page==='textPage'}}">
        <view class="toolbar-top toolbar-width" wx:if="{{isChooseFontSize}}">
            <view class="slider-box">
                <slider showValue bindchange="fontsizeSliderChange" max="26" min="8" value="14"></slider>
            </view>
        </view>
        <view class="toolbar-top" wx:if="{{isChooseFontColor}}">
            <view class="color-box">
                <view bindtap="fontColorChange" class="color-point" data-selected="{{item}}" style="background:{{item}}" wx:for="{{allColor}}"></view>
            </view>
        </view>
        <view class="toolbar-top toolbar-font-style" wx:if="{{isChooseFontPattern}}">
            <view>
                <text>斜体 : </text>
                <switch bindchange="fontStyleChange"></switch>
            </view>
            <view>
                <text>加粗 : </text>
                <switch bindchange="fontWeightChange"></switch>
            </view>
        </view>
        <view class="toolbar-bottom">
            <view bindtap="textToMainPage">
                <text class="icon-back"></text>
                <text class="text">主菜单</text>
            </view>
            <view bindtap="{{isTextEdit?null:'chooseaddText'}}">
                <text class="icon-add"></text>
                <text class="text">添加</text>
            </view>
            <view bindtap="chooseFontsize">
                <text class="icon-size"></text>
                <text class="text">大小</text>
            </view>
            <view bindtap="chooseFontColor">
                <text class="icon-color"></text>
                <text class="text">颜色</text>
            </view>
            <view bindtap="chooseFontPattern">
                <text class="icon-style"></text>
                <text class="text">样式</text>
            </view>
        </view>
    </view>
    <view class="confirm-bar1" wx:if="{{isCroper||allText.isTextActive}}">
        <text bindtap="{{isCroper?'cancelCrop':'cancelAddText'}}" class="icon-cross"></text>
    </view>
    <view class="confirm-bar2" wx:if="{{isCroper||allText.isTextActive}}">
        <text bindtap="{{isCroper?'competeCrop':'competeAddText'}}" class="icon-checkmark"></text>
    </view>
</view>
